<div class="vh-100" *ngIf="error">
  <div class="fixed top-0 right-0 m3 p3">
    <button class="refresh-icon" (click)="onRefresh()"></button>
  </div>
  <div [ngSwitch]="error.errorType" style="font-size: 1.25em">
    <div class="vh-100" *ngSwitchCase="ApplicationErrorType.UncaughtException">
      <report-error [error]="error" (reportError)="reportError.emit(true)"> </report-error>
    </div>
    <div *ngSwitchCase="ApplicationErrorType.NotNgApp">
      <div class="p3 m3 pt0">
        <p class="legible-color h1 message-gray">
          This application is not an Angular application.
        </p>
        <p class="legible-color h3 message-gray">
          This application cannot be inspected using Augury.
        </p>
      </div>
    </div>
    <div *ngSwitchCase="ApplicationErrorType.ProductionMode">
      <div class="p3 m3 pt0">
        <p class="legible-color">
          This application is running in production mode and therefore cannot be inspected using Augury.
        </p>
        <p class="legible-color pt3">
          If this is an Angular application, please rebuild your application in debug mode or remove the call to
          <span class="monospace">enableProdMode()</span>.
        </p>
      </div>
    </div>
  </div>
</div>
